<template>
  <div class="bg_img">
    <img class="bg" src="../assets/images/background.png" alt="">
    <div class="bg_content">
      <div class="login_content">
        <div class="login_bg"></div>
        <div class="content">
          <div class="logo_box">
            <div class="logo">
              <img src="../assets/logo.png" alt="">
            </div>
            <div class="text">Chat</div>
          </div>
          <form action="/submit-form" method="post">
            <div class="login_title">
              <div class="icon iconfont icon-Chat-smile"></div>
              <div class="title">账号</div>
            </div>
            <div class="input">
              <input class="custom-placeholder" type="text" placeholder="请输入账号" v-model="account" autocomplete>
              <div class="icon iconfont icon-jclear" @click="setAccountValue" v-if="account"></div>
            </div>
            <div class="login_title">
              <div class="icon iconfont icon-Chat-locked"></div>
              <div class="title">密码</div>
            </div>

            <div class="input">
              <input class="custom-placeholder" :type="inputType" placeholder="请输入密码" v-model="cipher" autocomplete>
              <template v-if="cipher">
                <div class="icon iconfont icon-chakanmima-" @click="setCipherType('text')"
                  v-if="inputType == 'password'"></div>
                <div class="icon iconfont icon-chakanmima" @click="setCipherType('password')" v-else></div>
              </template>
            </div>
          </form>
          <div class="login_menu cool-button" @click="accountLogin">登录</div>
        </div>
      </div>
    </div>
  </div>

</template>
<script>
import '@/assets/login.css';
import moment from 'moment';
import axios from 'axios';
import { ref, inject, nextTick, watch } from 'vue';
import http from '@/util/http';
import Cfg from '@/util/config';
import { showLoadingToast, showConfirmDialog, showImagePreview, showToast, Uploader, closeToast } from 'vant';
import CryptoJS from 'crypto-js';
export default {

  // 组件选项
  data() {
    return {
      // 数据对象
      inputType: 'password',
      account: '',
      cipher: ''
    };
  },
  mounted() {
    let that = this;
    const appConfig = inject("globalConfig");
    that.language = appConfig.lang

  },
  methods: {
    accountLogin() {
      let that = this;
      if(!that.cipher){
        showToast('请输入密码');
        return
      }
      const deviceId = localStorage.getItem('deviceId'); // 从localStorage获取设备ID
      const timestamp = Date.now(); // 获取当前时间戳
      const hashedPassword = CryptoJS.MD5(that.cipher).toString();
      console.log(hashedPassword + ',' + deviceId + ',' + timestamp)
    },
    setAccountValue() {
      let that = this;
      that.account = ''
    },
    setCipherType(value) {
      let that = this;
      that.inputType = value
    }
  }

}
</script>
